<template>
	<div>
		<div class="daohang">
			<span>首页</span>
			<div class="didiv">></div>
			<span>个人中心</span>
			<div class="didiv">></div>
			<span>专项练习—Web前端</span>
		</div>
		<div class="content">
			<div class="title">单选题</div>
			<div class="question">1.我是一个题目</div>
			<div class="options ">
				<div>A</div>
				<div>B</div>
				<div>C</div>
				<div>D</div>
			</div>
			<div class="result">
				<div>正确答案:A</div>
				<div>您的答案：</div>
			</div>
		</div>
	</div>
</template>

<script>
</script>

  <style scoped="scoped">
        body {
            background-color: #F6F6F6;
        }
        
        .daohang {
            margin-left: 210px;
            margin-top: 30px;
        }
        
        .daohang>span {
            margin-left: 20px;
        }
        
        .didiv {
            display: inline;
            margin-left: 20px;
        }
        
        .content {
            background-color: #fff;
            border-radius: 15px;
            height: 550px;
            width: 1200px;
            margin-top: 30px;
            margin-left: 230px;
        }
        
        .title {
            margin-left: 180px;
            padding-top: 20px;
            color: #C7B2AB;
        }
        
        .question {
            margin-left: 180px;
            margin-top: 10px;
        }
        
        .options>div {
            margin-left: 180px;
            margin-top: 10px;
            width: 800px;
            height: 80px;
            background-color: #F5F5F5;
            line-height: 80px;
            border-radius: 15px;
            padding-left: 40px;
        }
        
        .options div:hover {
            border: 1px solid #59D1C5;
            background-color: #fff;
        }
        
        .result {
            margin-top: 40px;
            margin-left: 180px;
            display: flex;
            font-size: 15px;
        }
        
        .result div:nth-child(2) {
            margin-left: 100px;
            color: orange;
            font-size: 15px;
        }
    </style>
